<template>
  <base-modal :title="t('task.list.richTextContent')" :show.sync="richTextVisible" width="600px" @close="handleClose">
    <div class="richtext-box">
      <BaseListForNoData v-if="!richTextContent && requestLoading" :notice-msg="t('common.base.tip.noData')"></BaseListForNoData>
      <div class="richtext-content" v-else v-html="richTextContent"></div>
    </div>
  </base-modal>
  
</template>
<script>
import { defineComponent, ref, computed, reactive, toRefs, set, getCurrentInstance } from 'vue';
/**api */
import { getRichTextContent, getImRichTextContent, getWarehouseRichTextContent } from '@src/api/SystemApi';
import { t } from '@src/locales';

export default defineComponent({
  name: 'base-view-rich-text',
  props: {
    analysisResults: {
      type: String,
      default: () => '',
    },
  },
  setup(props, { emit }) {
    const state = reactive({
      richTextVisible: false,
      requestLoading: false,
      richTextContent: ''
    });
    /** 打开弹框*/
    const openDialog = (value, defaultApi = true, isWarehouse = false) => {
      state.richTextVisible = true;
      state.richTextContent = '';
      getRichtextReq(value, defaultApi, isWarehouse)
    };
    /** 关闭 */
    const handleClose = () => {
      state.richTextVisible = false;
      state.requestLoading = false,
      state.richTextContent = ''
    };
    /** 获取富文本内容*/
    const getRichtextReq = async (value, defaultApi, isWarehouse) => {
      try {
        const richtextId = value;
        if (!richtextId) return state.requestLoading = true;
        // 兼容服务备注
        let getRichTextContentApi = defaultApi ? getRichTextContent : getImRichTextContent;

        let params = {ids: [richtextId]};
        // 获取物料信息
        if(isWarehouse) {
          getRichTextContentApi = getWarehouseRichTextContent;
          params.module = 'cloudWarehouse';
        }
        const res = await getRichTextContentApi(params);
        
        if (res.code == 0) {
          const richtextCon = res.result?.[0]?.content ?? '';
          state.richTextContent = richtextCon;
          state.requestLoading = true
        } else {
          throw new Error('Failed to get rich text content');
        }
      } catch (error) {
        console.error(error);
      }
    }
    return {
      ...toRefs(state),
      openDialog,
      handleClose,
      getRichtextReq
    };

  },
})
</script>
<style lang="scss" scoped>
.richtext-box {
  padding: 10px;
  min-height: 500px;
}
</style>

